<template>
	<scroll-view scroll-y="true" class="cases-edit" @click="hideSearchPanel">
		<view v-if="casesNeedInfo" class="part part1">
			<view class="flex-row-between p1">
				<view class="flex-row-start">
					<view class="photo bg-cover" :style="{backgroundImage: 'url(https://cdn.yingpaipay.com/' + (casesNeedInfo.patientSex == '0' ? 'man.png' : 'woman.png') + ')'}"></view>
					<view class="info">
						<view class="t1">{{casesNeedInfo.patientName}}</view>
						<view>{{casesNeedInfo.patientSex == '0' ? '男' : '女'}}<text class="t2">{{casesNeedInfo.patientAge}}岁</text></view>
					</view>
				</view>
				<view class="flex-row-center go" @click.stop="gotoRouter('/pages-doctor/cases/list?params=' + JSON.stringify(patientNeesInfo))">
					<image class="i1" src="../../static/images/icon1.png"></image>
					<view class="t">查看以往病例</view>
					<image class="i2" src="../../static/images/icon2.png"></image>
				</view>
			</view>
			<view class="flex-row-between p2">
				<view>
					<text class="t">科室：</text>
					<text>{{casesNeedInfo.departmentName}}</text>
				</view>
				<view>
					<text class="t">时间：</text>
					<text>{{casesNeedInfo.visitTime}}</text>
				</view>
			</view>
		</view>
		
		<view class="part part2">
			<view class="name">病史信息</view>
			
			<view class="title">
				<view class="label"><text class="red">*</text>主诉</view>
			</view>
			<view class="conten">
				<textarea placeholder-class="textarea-place" class="textarea-box"
				v-model="formData.complaint" placeholder="请描述您的所患疾病名称或症状" />
			</view>
			
			<view class="title flex-row-between">
				<view class="label">现病史</view>
				<uni-data-checkbox v-model="radio1" :localdata="radioData"></uni-data-checkbox>
			</view>
			<view v-show="radio1 == 1" class="conten">
				<textarea placeholder-class="textarea-place" class="textarea-box"
				v-model="formData.presentIllness" placeholder="请描述您的所患疾病名称或症状" />
			</view>
			
			<view class="title flex-row-between">
				<view class="label">既往史</view>
				<uni-data-checkbox v-model="radio2" :localdata="radioData"></uni-data-checkbox>
			</view>
			<view v-show="radio2 == 1" class="conten">
				<textarea placeholder-class="textarea-place" class="textarea-box"
				v-model="formData.pastHistory" placeholder="请描述您的所患疾病名称或症状" />
			</view>
			
			<view class="title flex-row-between">
				<view class="label">过敏史</view>
				<uni-data-checkbox v-model="radio3" :localdata="radioData"></uni-data-checkbox>
			</view>
			<view v-show="radio3 == 1" class="conten">
				<textarea placeholder-class="textarea-place" class="textarea-box"
				v-model="formData.allergies" placeholder="请描述您的所患疾病名称或症状" />
			</view>
			
		</view>
		
		<view class="part part3">
			<view class="name">体格检查</view>
			<view class="conten">
				<textarea placeholder-class="textarea-place" class="textarea-box"
				v-model="formData.pe" placeholder="请输入身高、体重、体温、脉搏和血压" />
			</view>
		</view>
		
		<view class="part part4">
			<view class="name">临床诊断</view>
			<view class="conten flex-row-start">
				<view class="sickness-t">类型</view>
				<view class="flex-1 flex-row-start aaa">
					<uni-data-checkbox v-model="radioType" :localdata="typeData"></uni-data-checkbox>
				</view>
			</view>
			<view class="conten flex-row-start">
				<view class="sickness-t">诊断</view>
				<view class="flex-1 flex-row-start flex-wrap sickness-temp">
					<view class="items flex-row-center" v-for="(item, index) in sicknessSelectedTemp" :key="index" @click="delSickness(item, index)">
						{{ item.sicknessName }}<uni-icons type="clear" color="#BFBFBF"></uni-icons>
					</view>
					<view class="add" @click.stop="showSearchPanel">+添加诊断</view>
				</view>
			</view>
			<view class="search-panel" v-if="searchPanelVisible" @click.stop="showSearchPanel">
				<view class="search-bar flex-row-start">
					<image class="icon" src="https://cdn.yingpaipay.com/%E5%88%87%E5%9B%BE%2021%402x.png" />
					<input type="text"
						class="input-box flex-1"
						placeholder-class="input-place"
						placeholder="搜索疾病名称或编号"
						v-model="sicknessKeyword"
						@input="getSicknessList"
					/>
					<uni-icons type="clear" size="28" @click.stop="hideSearchPanel"></uni-icons>
				</view>
				<scroll-view scroll-y class="sickness-list">
					<template v-if="sicknessKeyword && sicknessList[0].sicknessName">
						<view v-for="(sickness, index) in sicknessList" :key="index" class="items flex-row-between" @click.stop="sicknessClick(sickness)">
							<text>{{ sickness.sicknessName }}</text>
							<text>{{ sickness.code }}</text>
						</view>
					</template>
					<template v-else></template>
				</scroll-view>
			</view>
		</view>
		
		<view class="part part5">
			<view class="name">病例资料<text class="t">(复诊记录、病例、处方和检查报告等)</text></view>
			<u-upload-image :file-list="fileList" :limit="8" @on-success="uploadSuccess" @on-error="uploadError" @on-remove="uploadRemove" />
		</view>
		
		<view class="btn-submit" @click="onSubmit">保存</view>
	</scroll-view>
</template>

<script>
	import uUploadImage from '@/components/u-upload-image/u-upload-image.vue';
	import uniDataCheckbox from '@/components/uni/uni-data-checkbox/uni-data-checkbox.vue';
	import { onlyResolvesLast } from '@/utils/util.js';
	export default {
		components: { uniDataCheckbox, uUploadImage },
		data() {
			return {
				casesNeedInfo: null, // 写病历需要的数据
				patientNeesInfo: null, // 进入患者病历夹需要的数据
				
				formData: {
					doctorId: '',
					patientId: '',
					orderId: '',
					medRdNo: '',
					complaint: '',
					presentIllness: '',
					pastHistory: '',
					allergies: '',
					pe: '',
					diagCodeType: '',
					diseasesCode: '',
					diseasesName: '',
					records: '',
				},

				radioData: [
					{ text: '无', value: 0 },
					{ text: '有', value: 1 },
				],
				radio1: 0,
				radio2: 0,
				radio3: 0,
				
				typeData: [
					{ text: '中医', value: 'GB-21' },
					{ text: '西医', value: 'ICD-10_6' },
				],
				radioType: 'GB-21',
				
				sicknessSelectedTemp: [],
				searchPanelVisible: false,
				sicknessKeyword: '',
				sicknessList: [],
				
				fileList: [],
				
				casesId: null, // 病历ID
			}
		},
		onLoad(options) {
			let $params = JSON.parse(options.params)
			this.casesNeedInfo = $params
			this.patientNeesInfo = {
				patientId: $params.patientId,
				patientName: $params.patientName,
				patientSex: $params.patientSex,
				patientAge: $params.patientAge,
				outpatientNumber: $params.outpatientNumber
			}
			this.formData.doctorId = $params.doctorId
			this.formData.patientId = $params.patientId
			this.formData.orderId = $params.orderId
			this.formData.medRdNo = $params.medRdNo
			
			this.getCasesByOrderId()
		},
		methods: {
			// 根据订单ID获取病历详情
			getCasesByOrderId() {
				this.$api.getCasesByOrderId({
					params: {
						orderId: this.formData.orderId
					}
				}).then(res => {
					if (res.code == 200 && res.result) {
						this.casesId = res.result.id
						
						// 处理表单数据
						this.formData.complaint = res.result.complaint
						this.formData.presentIllness = res.result.presentIllness
						this.formData.pastHistory = res.result.pastHistory
						this.formData.allergies = res.result.allergies
						this.formData.pe = res.result.pe
						this.formData.diagCodeType = res.result.diagCodeType
						this.formData.diseasesCode = res.result.diseasesCode
						this.formData.diseasesName = res.result.diseasesName
						this.formData.records = res.result.records
						
						// 处理选项
						this.radio1 = res.result.presentIllness == '无' ? 0 : 1
						this.radio2 = res.result.pastHistory == '无' ? 0 : 1
						this.radio3 = res.result.allergies == '无' ? 0 : 1
						
						// 处理资料
						this.fileList = res.result.records.split(',')
						
						// 处理诊断数据
						if (res.result.diseasesName && res.result.diseasesCode) {
							let arr = []
							let arr1 = res.result.diseasesName.split('|')
							let arr2 = res.result.diseasesCode.split('|')
							arr1.forEach((item, index)=>{
								arr.push({
									sicknessName: item,
									code: arr2[index]
								})
							}) 
							this.sicknessSelectedTemp = arr
						}
					}
				});
			},
			// 展开疾病列表
			showSearchPanel() {
				this.searchPanelVisible = true
			},
			// 收起疾病列表
			hideSearchPanel() {
				this.sicknessKeyword = ''
				this.searchPanelVisible = false
			},
			// 删除诊断
			delSickness(sickness, index) {
				this.sicknessSelectedTemp.splice(index, 1)
				this.setSickness()
			},
			// 选择诊断
			sicknessClick(sickness) {
				if (!this.sicknessSelectedTemp.includes(sickness)) {
					this.sicknessSelectedTemp.push(sickness)
				}
				this.setSickness()
			},
			// 设置诊断数据
			setSickness() {
				const sicknessName = this.sicknessSelectedTemp.map((item) => {
					return item.sicknessName
				})
				const sicknessCode = this.sicknessSelectedTemp.map((item) => {
					return item.code
				})
				this.formData.diseasesName = sicknessName.join('|')
				this.formData.diseasesCode = sicknessCode.join('|')
			},
			// 疾病列表
			getSicknessList() {
				onlyResolvesLast(this.querySicknessList())
			},
			async querySicknessList(e) {
				const { code, result } = await this.$api.querySicknessPage({
					params:{
						pageNo:1,
						pageSize:10,
						sicknessName: this.sicknessKeyword,
						type: this.radioType
					}
				})
				if (code === 200) {
					this.sicknessList = result.records
				} else {
					uni.showToast({
						title: '查询疾病列表失败',
						icon: 'none'
					});
				}
			},
			// 病例资料
			uploadSuccess(res) {
				if (res.code == 200) {
					this.fileList.push(res.result.url);
				} else {
					uni.showToast({
						title: '文件上传失败',
						icon: 'none'
					});
				}
			},
			uploadError(e) {
				uni.showToast({
					title: '文件上传失败',
					icon: 'none'
				});
			},
			uploadRemove(e) {
				this.fileList.splice(e, 1);
			},
			// 提交
			onSubmit () {
				let that = this
				
				if (!this.formData.complaint) {
					uni.showToast({
						title: '请填写主诉',
						icon: 'none'
					});
					return
				}
				
				if (!this.formData.diseasesName) {
					uni.showToast({
						title: '请填写诊断',
						icon: 'none'
					});
					return
				}
				
				if (this.radio1 == 0) {
					this.formData.presentIllness = '无'
				}
				if (this.radio2 == 0) {
					this.formData.pastHistory = '无'
				}
				if (this.radio3 == 0) {
					this.formData.allergies = '无'
				}
				this.formData.records = this.fileList.join(',')
				
				if (this.casesId) {
					that.formData.id = that.casesId
					that.$api.editCases(that.formData).then(res => {
						that.onResult(res)
					});
				} else {
					that.$api.addCases(that.formData).then(res => {
						that.onResult(res)
					});
				}
			},
			onResult (res) {
				let that = this
				if (res.code == 200) {
					that.casesId = res.result
					uni.showModal({
						title: '提示',
						content: '保存成功，是否继续开处方?',
						success: function (res) {
							if (res.confirm) {
								that.gotoRouter('/pages-doctor/mypharmacy/mypharmacy?from=casesEdit&activeTab=1&selectModel=1&diseasesName=' + that.formData.diseasesName + '&diseasesCode=' + that.formData.diseasesCode)
							}
						}
					});
				} else {
					uni.showToast({
						title: res.message,
						icon: 'none'
					});
				}
			}
		}
	}
</script>

<style lang="less" scoped>
@import './edit.less';
</style>
